<template>
	<view class="yue-qrcode-modal">
		<u-popup :show="show" mode="center" @close="doClose" @open="doOpen" zIndex="10071" :closeOnClickOverlay="true"
			:safeAreaInsetBottom="false" round="10rpx">
			<view class="pop-ctx">
				<!-- 			<view class="pop-close">
					<image class="close" src="@/static/my/pop-close.png" mode="" @click="doClose()"></image>
				</view> -->

				<view class="pop-head">
					核销码
				</view>
				<view class="pop-body">
					<view class="qrcode-box">
						<image :src="qrcode" mode=""></image>
					</view>
					<view class="qrcode-text">
						<!-- 900248 -->
						{{code}}
					</view>
				</view>
				<view class="pop-foot flex-center">
					<view class="btn flex-center" @click="doConfirm()">
						确认
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		name: "order-hexiao-code-pop",
		data() {
			return {
				show: false,
				qrcode: '',
				code: '',

				info: {},
				hexiao_type: '', //核销类型  门票
				timer: null
			}
		},

		methods: {
			init(info = {}) {
				this.qrcode = info.qrcode || ''
				this.code = info.code || ''
				this.show = true;
				this.info = info;
				this.hexiao_type = info.hexiao_type;
				this.query_hexiao_status();
			},
			clearTimer() {
				clearInterval(this.timer)
				this.timer = null
			},

			query_hexiao_status() {
				if (this.hexiao_type == '门票') {
					this.timer = setInterval(() => {
						this.query_ticket()
					}, 3000)
				}
			},

			query_ticket() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'ticket_hxStatus',
						id: this.info.order_id, //订单id
						gid: this.info.tcode, //门票id
					},
				}).then(res => {
					if (res.code == 200) {
						this.clearTimer()
						this.$emit('changeHexiaoStatus', this.info)
					}
				})
			},

			doOpen() {
			
			},
			doClose() {
				this.show = false;
				this.clearTimer()
				// this.qrcode = ''
				// this.code = ''
			},
			doConfirm() {
				this.show = false
				this.clearTimer()
			}
		},
	}
</script>

<style lang="scss" scoped>
	::v-deep .u-popup__content {
		// border-radius: 32rpx 32rpx 32rpx 32rpx;
		background: transparent;
	}

	.pop-ctx {
		position: relative;
		width: 542rpx;
		width: 662rpx;
		min-height: 590rpx;
		padding: 60rpx 70rpx;
		margin: 0 auto;
		height: auto;
		border-radius: 32rpx;
		// overflow: hidden;
		background: #fff;
	}

	.pop-close {
		position: absolute;
		bottom: -108rpx;
		left: 50%;
		transform: translate(-50%);

		image {
			width: 48rpx;
			height: 48rpx;
		}
	}

	.pop-head {
		text-align: center;
		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 28rpx;
		color: #000000;
	}

	.pop-body {
		margin-top: 60rpx;

		.qrcode-box {
			width: 160rpx;
			height: 160rpx;
			width: 320rpx;
			height: 320rpx;

			margin: 0 auto;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.qrcode-text {
			margin-top: 30rpx;
			text-align: center;
			font-family: PingFang SC, PingFang SC;
			font-weight: 800;
			font-size: 32rpx;
			color: #000000;
		}
	}

	.pop-foot {
		margin-top: 50rpx;

		.btn {
			width: 402rpx;
			height: 80rpx;
			background: #CB0011;
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #FFFFFF;
		}
	}
</style>